{% extends "base.html" %}
{% block header_js %}
<script language="javascript" type="text/javascript" src="/static/js/date/WdatePicker.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
    });

    function loadModel(){
        var id = $('#model').val();
        if(id == '--') {
            alert("请选择机器类型");
            return false;
        }
        $.get('/host/ajax_get_model', {"id": id}, function(data){
            $("#model_info").html(data);
        });
    }

    function loadGroup(){
        var id = $('#group').val();
        if(id == '--') {
            alert("请选择报警组");
            return false;
        }
        $.get('/host/ajax_get_group', {"id": id}, function(data){
            $("#group_info").html(data);
        });
    }

    function loadStra(){
        var id = $('#stra').val();
        if(id == '--') {
            alert("请选择策略组");
            return false;
        }
        $.get('/host/ajax_get_stra', {"id": id}, function(data){
            $("#stra_info").html(data);
        });
    }
</script>
{% endblock %}

<body>
{% block header %}
{% include "host-menu.html" %}
{% endblock %}

{% block content %}
<div class="wrap">
	<div class="wrap_right tree">
	{% autoescape off %}
	    {{ tree }}
	{% endautoescape %}
	</div>
    <div class="wrap_left right">
		<div class="shenqing1">
			<h5 style="float:left;width:96%;margin-bottom:10px;">修改主机</h5>
		</div>
		<div class="caozuo_add">
		<form id="customForm" action="/host/modify/" method="post">
        <div class="box">
            <h2>主机</h2>
            <div class="row" style="display:none">
                <label class="">主机ID:</label>
                <input type="text" name="id" class="word_in boxinput" value="{{host.id}}" readonly="readonly"/>
            </div>
 
            <div class="row">
                <label class="">主机名字:</label>
                <input id="hostname" type="text" name="hostname" class="word_in boxinput" value="{{host.name}}"/>
                <span id="hostnameInfo">请给主机起一个名字。长度为10。</span>
            </div>
            <div class="row">
                <label>主机IP:</label>
                <input id="ip" type="text" name="ip" class="word_in boxinput"  value="{{host.ip}}"/>
                <span id="ipInfo">请输入主机的IP地址。</span>
            </div>
            
            <div class="row">
                <label>机房选择:</label>
		        <select id="idc" name="idc" class="sel_big boxinput">
					<option value="{{monitor.hid.idc.id}}">{{monitor.host.idc}}</option>
                     {%   for idc in idcs   %}
						<option value="{{idc.id}}">{{idc.name}}</option>
                     {%  endfor %}
				</select>
            </div>
          
             <div class="row">
                <label>产品线:</label>
	            <select id="product" name="product" class="sel_big boxinput">
					<option value="{{host.pid.id}}">{{host.pid}}</option>
                    {% for p in products %}
					<option value="{{p.id}}">{{p.name}}</option>
                    {% endfor %}
				</select>
            </div>
          
            <div class="row">
                <label>上架时间:</label>
		        <input id="time" type="text" name="setup_time" class="word_in boxinput" style="border:1px solid #7F9DB9;" value="{{host.setup_time|date:'Y-m-d'}}" onClick="WdatePicker()"/>
            	<span id="timeInfo">请选择时间日期。</span>
            </div>
          
            <div class="row">
                <label>机器型号:</label>
		    	<select id="model" name="model" class="big_sel boxinput" onChange="javascript:loadModel()">
					<option value="{{host.mid.id}}" >{{host.mid}}</option>
                    {% for m in models%}
					<option value="{{m.id}}">{{m.name}}</option>
                    {% endfor %}
		    	</select></br>
            </div>
            <div id = "model_info"></div>
          
            <h2>策略绑定</h2>
            <div class="row">
                <label>策略组:</label>
				<select id="stra" name="stra" onChange="javascript:loadStra()" class="big_sel boxinput">
					<option value="{{hostalert.sid.id}}">{{hostalert.sid}}</option>
					<option >---</option>
                    {% for s in stra %}
					<option value="{{s.id}}">{{s.name}}</option>
                    {% endfor %}
                </select>
            </div>
            <div id="stra_info" class="row"></div>

            <div class="row">
                <label>报警组:</label>
    	        <select id="group" name="group" onChange="javascript:loadGroup()" class="big_sel boxinput">
					<option value="{{hostalert.gid.id}}">{{hostalert.gid}}</option>
					<option >---</option>
                    {% for g in group %}
					<option value="{{g.id}}">{{g.name}}</option>
                    {% endfor %}
                </select>
            </div>    
            <div id="group_info" class="row"></div>

        </div>
	    <input type="submit" class="tijiao_big" value="&nbsp;&nbsp;提交" />
		</form>
		</div>
    </div>
</div>
{% endblock %}

</body>
</html>
